<!--
Sandstorm - Personal Cloud Sandbox
Copyright (c) 2014 Sandstorm Development Group, Inc. and contributors
All rights reserved.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

  http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->

<template name="identityLoginInterstitial">
  {{!--
    Interstitial to display when the user is logged in as an identity, rather than as an account.
  --}}
  <div class="identity-login-interstitial">
    {{#sandstormTopbarItem name="title" priority=5 topbar=globalTopbar}}
      Logging in...
    {{/sandstormTopbarItem}}

    <div class="centered-content">
    {{#with state=state}}
      {{!-- separate blocks for each possible state --}}

      {{#if state.loading}}
        <h1>loading...</h1>
      {{/if}}

      {{#if state.creatingAccount}}
        <h1>creating account...</h1>
        <button class="logout">Cancel</button>
      {{/if}}

      {{#if state.accountCreationFailed}}
        <h1>Failed to create account.</h1>
        {{#focusingErrorBox}}
          {{state.accountCreationFailed.message}}
        {{/focusingErrorBox}}
        <button class="logout">Log out</button>
      {{/if}}

      {{#if state.loggingInWithIdentity}}
        <h1>logging in to account...</h1>
        <button class="logout">Cancel</button>
      {{/if}}

      {{#if state.loginWithIdentityFailed}}
        <h1>Account login failed</h1>
        {{#focusingErrorBox}}
          {{state.loginWithIdentityFailed.message}}
        {{/focusingErrorBox}}
        <button class="logout">Log out</button>
      {{/if}}

      {{#if state.loggingInWithToken}}
        <h1>logging back in to account...</h1>
        <button class="logout">Cancel</button>
      {{/if}}

      {{#if state.loginWithTokenFailed}}
        <h1>Failed to resume session.</h1>
        {{#focusingErrorBox}}
          {{state.loginWithTokenFailed.message}}
        {{/focusingErrorBox}}
        <button class="logout">Log out</button>
      {{/if}}

      {{#if state.linkingIdentity}}
        <h1>linking identity to account...</h1>
        <button class="logout">Cancel</button>
      {{/if}}

      {{#if state.identityIsNotLoginIdentity}}
        {{#with unlinkIdentityState=unlinkIdentityState}}
          {{#if unlinkIdentityState.success}}
            {{#focusingSuccessBox}}
              Unlinked identity from {{unlinkIdentityState.success.name}}.
            {{/focusingSuccessBox}}
          {{/if}}

          <br>
          <p>You have authenticated as this identity</p>
          {{>identityCard currentIdentity}}
          <p class="warning-banner">but that is not a login identity for any account.</p>
          <p>The following identities can log in to your identity's accounts:</p>
          <ul>
            {{#each account in nonloginAccounts}}
            <li class="non-login-account">
              <ul>
                {{#each identity in account.identities}}
                <li>
                  {{> identityCardSignInButton identity=identity}}
                </li>
                {{/each}}
              </ul>
              <button class="unlink" data-user-id="{{account.accountId}}"
                      title="Unlink your identity from this account.">
                unlink
              </button>
            </li>
            {{/each}}
          </ul>
          <button class="logout">Go back</button>

          {{#if modalContext}}
            {{#modalDialogWithBackdrop onDismiss=cancelUnlink}}
              {{#if unlinkIdentityState.error}}
                {{#focusingErrorBox}}
                  {{unlinkIdentityState.error.error.reason}}
                {{/focusingErrorBox}}
              {{/if}}

              {{#with context=modalContext}}
              <p>
                Are you sure you want to unlink your identity from the account of {{ context.name }}?
              </p>
              {{/with}}

              <form class="standard-form">
                <div class="button-row">
                  <button class="danger" type="button" name="confirm-unlink" disabled={{unlinkIdentityState.unlinking}}>
                    Unlink
                  </button>
                  <button type="button" name="cancel-unlink">
                    Cancel
                  </button>
                </div>
              </form>
            {{/modalDialogWithBackdrop}}
          {{/if}}
        {{/with}}
      {{/if}}
    {{/with}}
    </div>
  </div>
</template>

<template name="identityManagementButtons">
  <div class="identity-management-controls">
    <div class="toggle-login">
      <label title={{disableToggleLogin.why}}>
        <input class="toggle-login" type=checkbox checked={{isLogin}} disabled={{disableToggleLogin}}
               data-identity-id="{{_id}}">
        Allow this identity to log in to your account.
      </label>
    </div>
    {{>loginIdentitiesOfLinkedAccounts _id=_id}}
    <div>
      <button class="unlink-identity" data-identity-id="{{_id}}">
        Unlink this identity
      </button>
    </div>
  </div>
</template>

<template name="loginIdentitiesOfLinkedAccounts">
  {{#if showOtherAccounts}}
  <div class="login-identities-of-linked-accounts">
    <p>This identity is shared with other accounts.
       Those accounts have the following login identities:
    </p>
    <ul class="unlinkable-identities">
      {{#each getOtherAccounts}}
      <li>
        {{> identityCard .}}
        <button class="unlink" data-user-id="{{loginAccountId}}">unlink</button>
      </li>
      {{/each}}
    </ul>
    <button class="hide-other-accounts">hide other accounts</button>
  </div>
  {{else}}
  {{#if getOtherAccounts}}
  <div class="login-identities-of-linked-accounts">
    This identity is shared with at least one other account.
    <button class="show-other-accounts">show other accounts</button>
  </div>
  {{/if}}
  {{/if}}
</template>

<template name="identityPicker">
  <ul class="identity-card-list">
    {{#each identities}}
    <li class="{{#if isCurrentIdentity}}current-identity{{/if}}">
      <button class="pick-identity" data-identity-id="{{_id}}">
        {{> identityCard .}}
      </button>
    </li>
    {{/each}}
  </ul>
</template>

<template name="identityCard">
 <div class="identity-card" data-service-name="{{profile.service}}">
  <div class="picture" style="background-image: url('{{ profile.pictureUrl }}');"></div>
  <div class="name">{{profile.name}}</div>
  <div class="intrinsic-name">{{intrinsicName}}</div>
 </div>
</template>

<template name="identityCardSignInButton">
  <div class="identity-card-sign-in">
  <button class="sign-in" title="sign in as {{identity.profile.name}}"
          disabled={{clicked}}>
    {{> identityCard identity }}
  </button>
  {{#if clicked}}
    {{#with form}}
      <h4>Sign in</h4>
       <div class="login-buttons-list light-border">
         {{> Template.dynamic template=name}}
       </div>
    {{/with}}
    {{> _loginButtonsMessages ""}}
   {{else}}
     {{#with unclickedMessage}}
       <p>{{.}}</p>
     {{/with}}
   {{/if}}
  </div>
</template>
